<div class="element-property">
    <div class="element-property-title">
        {{'editor.controls-iframe-settings' | translate}}
    </div>
    <div class="iframe-selection">
        <div class="element-property-header">
            <span>{{'iframe.property-data' | translate}}</span>
        </div>
        <div>
            <div class="my-form-field section-item section-item-block">
                <span>{{'iframe.property-name' | translate}}</span>
                <input [(ngModel)]="data.settings.name" (change)="onPropertyChanged()" (keyup.enter)="onPropertyChanged()" type="text">
            </div>
            <div class="my-form-field section-item section-item-block mt5">
                <span>{{'iframe.property-address' | translate}}</span>
                <input [(ngModel)]="property.address" (change)="onPropertyChanged()" (keyup.enter)="onPropertyChanged()" type="text">
            </div>
            <app-flex-device-tag class="block mt5 item-device-tag"
                                 (change)="onTagChanged($event)"
                                 [variableId]="property.variableId">
            </app-flex-device-tag>
            <div class="section-newline"></div>
        </div>
    </div>
</div>